<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>PomodoroClock</title>

    <link rel="stylesheet" type="text/css" href="http://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
    <link href="https://fonts.googleapis.com/css?family=Bitter|Sedgwick+Ave+Display" rel="stylesheet">
    <link rel="stylesheet" type="text/css" href="css/style.css">
</head>
<body>
    <img class="close" src="close.png" id="close" alt="">
<h1>PomodoroClock</h1>

<div class="main">
    <div class="control">
        <div class="break">
            <p>BREAK LENGTH</p>
            <i class="fa fa-minus-square-o" aria-hidden="true" id="break-minus"></i>
            <span id="break-length">5</span>
            <i class="fa fa-plus-square-o" aria-hidden="true" id="break-plus"></i>
        </div>
        <div class="length">
            <p>SESSION LENGTH</p>
            <i class="fa fa-minus-square-o" aria-hidden="true" id="session-minus"></i>
            <span id="session-length">25</span>
            <i class="fa fa-plus-square-o" aria-hidden="true" id="session-plus"></i>
        </div>
    </div>
    <div class="clock">
        <h2 id="show-title">Session</h2>
        <h2 id="show-time">25:00</h2>
        <span id="per"></span>

    </div>
</div>

<script src='http://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js'></script>
<script>if (typeof module === 'object') {window.jQuery = window.$ = module.exports;};</script>
<script type="text/javascript" src="js/clock.js"></script>
<script type="text/javascript" src="renderer.js"></script>
</body>
</html>
